<template>
  <div>
    <el-table
      :data="tableData"
      border
      stripe
      :header-cell-class-name="'headerBg'"
      @selection-change="handleSelectionChange"
    >
      <el-table-column
        prop="username"
        label="留言人"
        width="100"
      ></el-table-column>
      <el-table-column prop="mesTime" label="留言时间" width="180"> </el-table-column>
      <el-table-column
        prop="message"
        label="留言内容"
        width="1000"
      ></el-table-column>
    </el-table>
    <div style="padding: 10px 0">
      <el-pagination
        @size-change="handleSizeChange"
        @current-change="handleCurrentChange"
        :current-page="pageNum"
        :page-sizes="[2, 5, 10, 20]"
        :page-size="pageSize"
        layout="total, sizes, prev, pager, next, jumper"
        :total="total"
      >
      </el-pagination>
    </div>
  </div>
</template>

<script>
import { serverIp } from "../../../public/config";

export default {
  name: "User",
  data() {
    return {
      user: localStorage.getItem("user")
        ? JSON.parse(localStorage.getItem("user"))
        : {},
      serverIp: serverIp,
      tableData: [],
      total: 0,
      pageNum: 1,
      pageSize: 10,
      activityName: "",
      form: {},
      multipleSelection: [],
      cid: -1
    };
  },
  created() {
    this.getCampus().then(res => {
      this.cid = res.id
      console.log("+++++++++"+this.cid)
      this.request
        .get("/mes/showMes", {
          params: {
            pageNum: this.pageNum,
            pageSize: this.pageSize,
            cid: this.cid,
          },
        })
        .then((res) => {
          this.tableData = res.data.records;
          this.total = res.data.total;
        });
    })
    
  },
  methods: {
    load() {
      
    },
    async getCampus() {
      return (await this.request.get("/campus/mycampus?uid=" + this.user.id)).data
    },
    handleSelectionChange(val) {
      console.log(val);
      this.multipleSelection = val;
    },
    handleSizeChange(pageSize) {
      console.log(pageSize);
      this.pageSize = pageSize;
      this.load();
    },
    handleCurrentChange(pageNum) {
      console.log(pageNum);
      this.pageNum = pageNum;
      this.load();
    },
  },
};
</script>


<style>
.headerBg {
  background: #eee !important;
}
</style>
